<template>
<div>
	<div class="bang">
			
	</div>
    <div class="ds-header">
    	<router-link to="/ding" tag="div" class="s-w">
    	</router-link>
    	<div class="ds-i">
    		<div class="ds-shi">
    			dfgdsga
    		</div>
    		<div class="ds-i-top">
    			<span>dfsf</span>
    			<span>dfsf</span>
    		</div>
    		<div class="ds-i-bottom">
    			<span>dfsf</span>
    			<span>dfsf</span>
    			<span>dfsf</span>
    		</div>
    	</div>
    </div>
    <div class="ds-list">
    	<div class="d-l-b">
    		商品信息
    	</div>
    	<div class="d-l-t">
    		<li></li>
    		<li></li>
    		<li></li>
    	</div>
	    <div class="d-l-x">
	    	<li>
	    		<span>fdfsd</span>
	    		<p>dfsa</p>
	    	</li>
	    	<li>
	    		<span>sdf</span>
	    		<p>safd</p>
	    	</li>
	    	<li>
	    		<span>fa</span>
	    		<p>fsa</p>
	    	</li>
	    </div>
	    <div class="d-l-q">
	    	总计 ￥79.9	    	
	    </div>
	</div>
	<div class="ds-footer">
		<li class="bia">订单信息</li>
    	<li>
    		<span>订单号</span>
    		<p>17837052369447113441</p>
    	</li>
	</div>
</div>   
</template>

<script>
export default {
    name:'Dais',
    data(){
        return{
            tit:'我 的'
        }
    },
    mounted() {
        this.$emit('toparent',this.tit)
    },
}
</script>

<style scoped>
.d-l-b{
width: 100%;
height:5rem;
line-height: 5rem;
color: rgba(102, 102, 102, 1);
font-size: 1.6rem;
text-align: left;
font-family: PingFangSC-regular;	
}

.d-l-t{
width: 100%;
height: 7.25rem;
display: flex;
justify-content: space-between;
align-items: center;
}

.d-l-t li{
width: 7.25rem;
height: 7.25rem;
background: #E0E0E0;
}
.d-l-x{
width: 100%;
height: 7rem;
padding: 0.5rem 0;
}
.d-l-x li{
height:2.3rem;
line-height: 2.3rem;
display: flex;
justify-content: space-between;
align-items: center;	
}

.d-l-x span{
width:11rem;
color: rgba(102, 102, 102, 1);
font-size: 1.4rem;
text-align: left;
font-family: PingFangSC-regular;
}


.d-l-x p{
width:11rem;
font-size: 1.4rem;
text-align: right;
font-family: PingFangSC-regular;
color: rgba(153, 153, 153, 1);
}

.d-l-q{
height:5rem;
color: rgba(115, 115, 115, 1);
font-size: 1.8rem;
text-align: right;
font-family: PingFangSC-regular;
line-height: 4.5rem;
}





	
	
.bang{
background: blanchedalmond;
width:100%;
height: 3.67rem;
}
	
.ds-header{
height: 19.17rem;	
position: relative;
background: #E6AF5C;
}


.s-w{
position: absolute;
left: 1rem;
top: 1rem;
width: 1.25rem;
height: 1.25rem;
background:red;
}

.ds-i{
position: absolute;
left: 1.92rem;
top: 12rem;
width: 27.5rem;
height: 14.42rem;
border-radius: 1rem;
background: rgba(251, 251, 251, 1);
}

.ds-shi{
top:-4.2rem;
left: 9.65rem;
position: absolute;
border-radius:50% ;
width: 8.33rem;
height: 8.33rem;
line-height: 8.33rem;
text-align: center;
background:#B3E19D;
color: rgba(102, 102, 102, 1);
font-size: 1rem;
font-family: PingFangSC-regular;
}

.ds-i-top{
width: 100%;
height: 8rem;
display: flex;
flex-direction: column;
justify-content: flex-end;	
}

.ds-i-top span{
height: 1.6rem;
color: rgba(102, 102, 102, 1);
font-size: 1.4rem;
text-align: center;
font-family: PingFangSC-regular;


}

.ds-i-bottom{
width: 100%;
height: 6.42rem;
display: flex;
justify-content: space-around;
align-items: center;
}

.ds-i-bottom span{
width: 6rem;
height: 2.5rem;
line-height: 2.3rem;
border-radius: 6.83rem;
text-align: center;
border: 0.1rem solid rgba(187, 187, 187, 1);
color: rgba(204, 204, 204, 1);
font-size: 1.2rem;
font-family: PingFangSC-regular;

}

.ds-list{
padding: 0 2rem;
margin: 8rem auto 0;
width: 27.33rem;
height: 26.33rem;
box-sizing: border-box;
border-radius: 1rem;
background-color: rgba(242, 242, 242, 1);
}

.ds-footer{
margin: 1rem auto 0;
width: 27.33rem;
height: 9.33rem;
border-radius: 1rem;
background: #F2F2F2;
box-sizing: border-box;
padding: 0 2rem;
}

.ds-footer .bia{
width: 100%;
height:4rem;
line-height: 4rem;
color: rgba(102, 102, 102, 1);
font-size: 1.6rem;
justify-content: flex-start;
font-family: PingFangSC-regular;
}

.ds-footer li{
display: flex;
justify-content: space-between;	
}

.ds-footer span{
width: 3.5rem;
height: 1.67rem;
color: rgba(102, 102, 102, 1);
font-size: 1.4rem;
text-align: left;
font-family: PingFangSC-regular;	
}

.ds-footer p{
width: 14rem;
height: 1.67rem;
color: rgba(153, 153, 153, 1);
font-size: 1.4rem;
text-align: right;
font-family: PingFangSC-regular;

}    
</style>

